<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8" />
		<title>Column3d sample in the Box</title>
		<meta name="Description" content="" />
		<meta name="Keywords" content="" />
		<script type="text/javascript" src="../core/Jidea-core.js"></script>
		<script type="text/javascript" src="../core/Jidea-event.js"></script>
		<script type="text/javascript" src="../core/Jidea-math.js"></script>
		<script type="text/javascript" src="../core/Jidea-assert.js"></script>
		<script type="text/javascript" src="../core/Jidea-painter.js"></script>
		<script type="text/javascript" src="../core/Jidea-component.js"></script>
		<script type="text/javascript" src="../core/Jidea-interface.js"></script>
		<script type="text/javascript" src="../core/Jidea-legend.js"></script>
		<script type="text/javascript" src="../core/Jidea-label.js"></script>
		<script type="text/javascript" src="../core/Jidea-style.js"></script>
		<script type="text/javascript" src="../core/Jidea-chart.js"></script>
		<script type="text/javascript" src="../core/Jidea-coordinate.js"></script>
		<script type="text/javascript" src="../core/Jidea-element.js"></script>
		<script type="text/javascript" src="../core/Jidea-crosshair.js"></script>
		<script type="text/javascript" src="../core/Jidea-text.js"></script>
		<script type="text/javascript" src="../core/Jidea-tip.js"></script>
		<script type="text/javascript" src="../core/Jidea-rectangle.js"></script>
		<script type="text/javascript" src="../core/Jidea-rectangle3d.js"></script>
		<script type="text/javascript" src="../core/Jidea-column.js"></script>
		<script type="text/javascript" src="../core/Jidea-column3d.js"></script>
		<script type="text/javascript" src="../core/Jidea-custom.js"></script>
		<script type="text/javascript" src="data.js"></script>
		<style type="text/css">
			body{
				margin-top:10px;
				text-align: center;
			}
			#myCanvas div{
			margin:0px auto;
		}
		</style>
		<script type="text/javascript">
					$(function(){
						var bg = '#d6dbd2',dc = Jidea.Math.dark(bg,0.1),
						bg1 = 'rgba(214,219,210,0.4)';
						
						
						//下底-底-左-右-上-前
						var wall = [
								{color:Jidea.Math.dark(bg1,0.12)},
								{color:Jidea.Math.dark(bg1,0.14)},
								{color:Jidea.Math.dark(bg1,0.2)}
							];
						
						var column3d = new Jidea.Column3D({
							render : 'myCanvas',
							data: data,
							align:'center',
							coordinate:{
								width:560,
								height:300,
								background_color:'#d6dbd2',
								magical_shell:wall,
								kedu:[{
									 position:'left',	
									 start_scale:0,
									 end_scale:200,
									 scale_line_enable:false,
									 scale:20,
									 listeners:{
										parseText:function(t,x,y){
											return {text:t+"T"}
										}
									}
								}]
							},
							tip:{
								enable:true,
								shadow:true,
								showType:'fixed'
							},
							title : 'Column3d sample in the Box',
							width : 800,
							height : 500,
							hiswidth:50,
							xAngle:70,
							yAngle:30,
							zScale:2,
							background_color:'#FEFEFE',
							listeners:{
								parseValue:function(o){
									return o.name+"-"+o.value;
								}
							}
							
						});
					
					//开始画图
					column3d.draw();
				});
				
			</script>
		</head>
		<body>
			<div><a href="../index.html">Home</a>&nbsp; Sample</div>
			<br>
			<div id='myCanvas'></div>
		</body>
</html>
